<template>
<div>
      <div class="nav bg-theme color-f text-l" >
     <div style="display:flex;flex:2;">
          <i class="iconfont icon-fanhui font19 pl08 iback" @click="gotoMobile"></i>
          <!-- 详情进入 -->
          <span class="font19 ml16">
              数智党建
          </span>
        </div>
    </div> 
    <div class="graybackground">
        <div class="" style=" margin-top:50px;display: flex;padding: 15px 0 15px 0;">
            <div class="blue_item"></div>
            <span class="font18" style="display: flex; line-height: 33px;margin-left:5px;  flex:1;">基层党组织服务支撑</span>
         </div>  
         <div style="width: 100%;display:flex;">
           <div class="box" @click="dwdyytxx">
             <p class="font15" style="display:flex;margin:auto; ">党委第一议题学习</p>
             <img
                 :src="require('@/assets/images/dyyt_icon.png')"
                  style="width: 50px;height: 50px;text-align:center; margin:auto;"
             />
         
           </div>
           <div class="box" @click="zbjqxxzd">
            <p class="font15" style="display:flex;margin:auto; ">支部近期学习重点</p>
             <img
                 :src="require('@/assets/images/xxzd_icon.png')"
                  style="width: 50px;height: 50px;text-align:center; margin:auto;"
             />
           </div>
         </div>
          <div class="" style=" margin-top:10px;display: flex;padding: 15px 0 15px 0;">
            <div class="blue_item"></div>
            <span class="font18" style="display: flex; line-height: 33px;margin-left:5px;  flex:1;">党建指导员</span>
         </div>  
         <div style="width: 100%;display:flex;">
           <div class="box" @click="box1">
             <p class="font15" style="display:flex;margin:auto; ">政策宣讲</p>
             <img
                 :src="require('@/assets/images/zcxj_icon.png')"
                  style="width: 50px;height: 50px;text-align:center; margin:auto;"
             />
         
           </div>
           <div class="box" @click="box2">
            <p class="font15" style="display:flex;margin:auto; ">思政纪实</p>
             <img
                 :src="require('@/assets/images/szjs_icon.png')"
                  style="width: 50px;height: 50px;text-align:center; margin:auto;"
             />
           </div>
         </div>
         <div style="width: 100%;display:flex;margin-top:10px">
           <div class="box" @click="box3">
             <p class="font15" style="display:flex;margin:auto; ">问题协调</p>
             <img
                 :src="require('@/assets/images/wtsb_icon.png')"
                  style="width: 50px;height: 50px;text-align:center; margin:auto;"
             />
         
           </div>
           <div class="box" @click="box4">
            <p class="font15" style="display:flex;margin:auto; ">经验推广</p>
             <img
                 :src="require('@/assets/images/jytg_icon.png')"
                  style="width: 50px;height: 50px;text-align:center; margin:auto;"
             />
           </div>
         </div>
    </div>
</div>
  
</template>
<script>
   export default{
       mounted(){
            if (window.history && window.history.pushState) {
                console.log('main点击物理返回键1111');
                history.pushState(null, null, document.URL);
                window.addEventListener('popstate', this.gotoMobile, false);//false阻止默认事件
            }
       },
       methods:{
        gotoMobile(){
            console.log('main点击物理返回键222'),
            this.moaBridge_ha_djfupt.closeDoc({refresh:false,appcode:'djfupt'});
        },
        dwdyytxx(){
            this.$router.push({
                name:'dwdyytTable',
            })   
       },
        zbjqxxzd(){
            localStorage.setItem('xxzdtabNumber',0)
            localStorage.setItem('xxzdtodoactiveNumber', 0)
            this.$router.push({
                name:'xxzdtabview',
            })   
       },
        box1(){
            localStorage.setItem('todoactiveNumber', '');
            localStorage.setItem('tabactiveNumber', '');
            this.$router.push({
                name:'tabview',
                query:{
                    pagename:'1',
                    tabNumber:1,
                }
            })   
       },
        box2(){
            localStorage.setItem('todoactiveNumber', '');
            localStorage.setItem('tabactiveNumber', '');
            this.$router.push({
                name:'tabview',
                query:{
                    pagename:'2',
                    tabNumber:2,
                }
            })   
       }, 
       box3(){
           localStorage.setItem('todoactiveNumber', '');
           localStorage.setItem('tabactiveNumber', '');
            this.$router.push({
                name:'tabview',
                query:{
                    pagename:'3',
                    tabNumber:3,
                }
            })   
       }
       , box4(){
           localStorage.setItem('todoactiveNumber', '');
           localStorage.setItem('tabactiveNumber', '');
            this.$router.push({
                name:'tabview',
                query:{
                    pagename:'4',
                    tabNumber:4,
                }
            })   
       },
      
   },
    destroyed () {
          console.log('destroyeddestroyeddestroyed')
        window.removeEventListener('popstate',this.gotoMobile,false);//false阻止默认事件
    },
   }
</script>
<style scoped>
.graybackground{
    height: 100vh;
    background-color: whitesmoke;
}
.line {
  width: 100%;
  height: 64px;
  padding-right: 16px;
  border-bottom: 1px solid #eeeeee;
}
.wrap {
  width: 100%;
  padding-left: 16px;
}
.box{
    margin-left: 10px;
    width: 45%;
    height: 90px;
    background-color: white;
    text-align: center;
    border-radius: 5px;
    display:flex;
}
</style>